<!--
 * @Author: 张卓南
 * @Date: 2023-10-20 20:20:11
 * @LastEditTime: 2023-10-21 15:16:05
 * @Description: 
-->

<template>
  <div>
    <div class="flex justify-center px-8">
      <div class="flex flex-col w-full">
        <div class="box pd-2 mt-10">
          <van-calendar
            title="日期选择"
            :poppable="false"
            :show-confirm="false"
            :style="{ height: '400px' }"
          />
        </div>
      </div>
    </div>
    <Piece :data="item" v-for="(item, index) in sharedData.resultList" />
  </div>
</template>

<script lang="ts">
import { computed, onMounted, reactive, ref, unref, toRefs } from "vue";
import { useRoute, useRouter } from "vue-router";
import Piece from "@/components/Piece.vue";

const sharedData = reactive({
  resultList: [
    {
      status: "1",
      loginName: "嬴政",
      mobileNum: "",
      licenseNum: "",
      driveCertificateDate: "",
      upWorkSeat: 2,
      downWorkSeat: 1,
      workplace: "青年城",
      homeAddress: "花山",
      price: "",
      nums: "2",
      up: "上班",
      dan: "双程",
    },
    {
      status: "1",
      loginName: "李斯",
      mobileNum: "",
      licenseNum: "",
      driveCertificateDate: "",
      upWorkSeat: 2,
      downWorkSeat: 1,
      workplace: "花山",
      homeAddress: "九峰",
      price: "",
      nums: "1",
      up: "下班班",
      dan: "单程",
    },
    {
      status: "2",
      loginName: "嫪毐",
      mobileNum: "",
      licenseNum: "",
      driveCertificateDate: "",
      upWorkSeat: 2,
      downWorkSeat: 1,
      workplace: "洛阳",
      homeAddress: "长安",
      price: "",
      nums: "2",
      up: "上班",
      dan: "单程",
    },
    {
      status: "3",
      loginName: "赵姬",
      mobileNum: "",
      licenseNum: "",
      driveCertificateDate: "",
      upWorkSeat: 2,
      downWorkSeat: 1,
      workplace: "赵国",
      homeAddress: "秦国",
      price: "",
      nums: "2",
      up: "上班",
      dan: "单程",
    },
    {
      status: "4",
      loginName: "吕不韦",
      mobileNum: "",
      licenseNum: "",
      driveCertificateDate: "",
      upWorkSeat: 2,
      downWorkSeat: 1,
      workplace: "花山",
      homeAddress: "九峰",
      price: "",
      nums: "1",
      up: "下班",
      dan: "双程",
    },
  ],
});
export default {
  name: "zaikeInfo",
  // 注册组件
  components: {
    Piece,
  },
  setup() {
    return { sharedData };
  },
};
</script>

<style scoped lang="less">
:deep(.van-card) {
  background: white;
  padding: 0;
}
.box {
  box-shadow: 0px 4px 24px 0px rgba(0, 0, 0, 0.2);
  border-radius: 8px;
}
.title {
  display: flex;
  justify-content: space-between;
}
.content {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
</style>
